<template>
  <base-breadcrumb :title="$route.meta.title">
    <!-- 岗位质量责任目标协议书 -->
    <div id="base-breadcrumb" style="position: relative; overflow: hidden">
      <!-- 搜索 -->
      <searchData :searchData="searchArr" @search="search"></searchData>
      <!-- 表格 -->
      <a-card :bordered="false">
        <!-- <title-name title="质量责任书管理"></title-name> -->
        <!-- 表格 -->
        <list-table ref="table" tableLayout="fixed" size="default" :columns="columns" :request="loadData">
          <a-button slot="prefix" v-btnPermission="[
                      {
                        ident: 'prma_seex',
                        code: 'seex_qm_036_add_01'
                      },
                      {
                        ident: 'prma_buco',
                        code: 'buco_qm_036_add_01'
                      }
              ]" icon="plus" type="primary" @click="handleManage(2)"
            >新增质量责任书</a-button
          >
          <!-- 统计汇总 -->
          <AuditSummary ref="auditSummary" slot="bottom" title="质量责任书" :countList="countList" />
          <template slot="actions" slot-scope="text, record">
            <MoreButton>
            <a v-btnPermission="[
                      {
                        ident: 'prma_seex',
                        code: 'seex_qm_036_loo_03'
                      },
                      {
                        ident: 'prma_buco',
                        code: 'buco_qm_036_loo_03'
                      }
              ]" @click="handleManage(0, record)">查看</a>
            <!-- 公司人员可编辑所有的，分公司人员只能编辑自己分公司的 -->
            <template>
              <a v-btnPermission="[
                      {
                        ident: 'prma_seex',
                        code: 'seex_qm_036_edi_02'
                      },
                      {
                        ident: 'prma_buco',
                        code: 'buco_qm_036_edi_02'
                      }
              ]" @click="handleManage(1, record)">编辑</a>
              <template v-if="record.isDisable">
                <a v-btnPermission="[
                      {
                        ident: 'prma_seex',
                        code: 'seex_qm_036_sta_05'
                      },
                      {
                        ident: 'prma_buco',
                        code: 'buco_qm_036_sta_05'
                      }
              ]" @click="handleToggle(record)">启用</a>
              </template>
              <template v-else>
                <a class="del_btn" v-btnPermission="[
                      {
                        ident: 'prma_seex',
                        code: 'seex_qm_036_sto_04'
                      },
                      {
                        ident: 'prma_buco',
                        code: 'buco_qm_036_sto_04'
                      }
              ]" @click="handleToggle(record)">停用</a>
              </template>
            </template>
            </MoreButton>
          </template>
          <!-- 联系地址 -->
          <a slot="website" slot-scope="text" :href="text" target="_blank">{{ text }} </a>
        </list-table>
      </a-card>
    </div>
  </base-breadcrumb>
</template>

<script>
import { postDutyBook } from '@/api/quality/quality' // api
import BasePage from '@/views/basePage'
import SelectSubCompany from '@/components/Select/SelectSubCompany' // 分公司
import Selector from '@/components/Select/Selector' // 项目名称
import OrgTreeSelect from '@/components/OrgTreeSelect'
import AuditSummary from '@/views/quality/components/AuditSummary' // 统计汇总

const searchArr = [
  // 搜索框
  // {
  //   name: '所属单位',
  //   valueKey: 'searchQuery',
  //   type: OrgTreeSelect,
  // },
  {
    name: '所属单位',
    type: SelectSubCompany,
    valueKey: 'branchComId'
  },
  {
    name: '责任岗位',
    type: Selector,
    selectType: '53',
    valueKey: 'postId'
  },
  {
    name: '责任书名称',
    type: 'input',
    value: 'name'
  }
]
const columns = [
  {
    title: '序号',
    width: 80,
    dataIndex: 'index',
    customRender() {
      return arguments[2] + 1
    }
  },
  {
    title: '分公司',
    ellipsis: true,
    width: 180,
    dataIndex: 'branchComName'
  },
  {
    title: '责任书名称',
    ellipsis: true,
    width: 180,
    dataIndex: 'name'
  },
  {
    title: '岗位名称',
    ellipsis: true,
    width: 180,
    dataIndex: 'postName'
  },
  {
    title: '岗位类型',
    ellipsis: true,
    width: 180,
    dataIndex: 'bookTypeName'
  },
  {
    title: '创建人',
    width: 180,
    dataIndex: 'filler'
  },
  {
    title: '创建时间',
    width: 180,
    dataIndex: 'fillerDate'
  },
  {
    title: '操作',
    dataIndex: 'actions',
    width: 180,
    align: 'center',
    scopedSlots: { customRender: 'actions' }
  }
]
export default {
  name: 'a' + Date.now(),
  extends: new BasePage(),
  components: {
    AuditSummary
  },
  data() {
    this.columns = columns
    this.searchArr = searchArr
    return {
      queryParam: {}, // 查询参数
      removeApi: postDutyBook,
      // 加载数据方法 必须为 Promise 对象
      loadData: (parameter) => {
        const requestParameters = Object.assign({}, parameter, this.queryParam)
        return postDutyBook.postList(requestParameters).then((res) => {
          // 更新汇总总数
          this.$nextTick(() => {
            this.$set(this.$refs.auditSummary.countInfo, 'total', res.totalSize)
          })
          return res
        })
      },
      editModel: 0,
      api: postDutyBook, // 汇总api
      countList: [
        {
          title: '总数：',
          value: 'total',
          needUnit: true
        }
      ], // 汇总列表
      form: {},
      exportLoading: {
        0: false,
        1: false
      } // 导出loading
    }
  },
  methods: {
    // 搜索
    search(value) {
      value && (this.queryParam = value)
      this.$refs.table.refresh(true)
    },
    /**
     * 操作栏
     * @param {Number} type -操作类型：0 查看；1 编辑；2 新增
     * @param {Object} record -当前行
     */
    handleManage(type, record) {
      this.editModel = type
      let query = {
        editModel: type
      }
      if (record && record.id) {
        query.id = record.id
      }
      this.$router.push({
        name: 'postDutyBookEdit',
        query
      })
    },
    /**
     * 停启用
     * @param {Object} row -当前行
     */
    handleToggle(row) {
      this.$confirm({
        title: '温馨提示',
        content: `确定${row.isDisable ? '启用' : '停用'}？`,
        onOk: () => {
          return postDutyBook.switchDisable({ id: row.id }).then((res) => {
            if (res.data.code === 200) {
              this.$message.success(`${row.isDisable ? '启用' : '停用'}成功！`)
              // 刷新当前页
              this.$refs.table.getData()
            }
          })
        }
      })
    }
  }
}
</script>
